Vue.component("app_panel", {
	props: ['account'],
	data: function() {
		var data = {
			username: null,
			// account:null,
			contacts: null,
			// 全部好友
			recents: null,
			// 全部聊天对象
			icon_src: con_icon_url,
			
			username_hidden:false,
			new_username:null,
			username_input_hidden:true,
			recent_icon: "images/chat_yes_icon.png",
			wenzhang_icon: "images/wenzhang_no_icon.png",
			contact_icon: "images/contact_no_icon.png",
			tabShowRecent: true,
			suprot_notification: true,
			// 浏览器是否支持桌面提醒
			is_notificarion: true,
			// 是否进行桌面提醒
			isVoice: true,
			isMin: false,
			// 判断浏览器是否最小化，默认不为最小化
			msg_box_list: [],
			tabHideRecent: false,
			tabShowWenzhang: false,
			tabHideWenzhang: true,
			tabShowContact: false,
			tabHideContact: true,
			rightCurrContent: "logo_comp",
			show_big_img_comp: null,
			chat_panel_type: null,
			chat_panel_role: null,
			// 当前聊天面板的参与角色，为空即视为没打开聊天面板

		}
		return data;
	},

	created: function() {
		console.log("创建主面板组件");
	},
	ready: function() {
		
		var hiddenProperty = 'hidden' in document ? 'hidden' : 'webkitHidden' in document ? 'webkitHidden' : 'mozHidden' in document ? 'mozHidden' : null;
		var visibilityChangeEvent = hiddenProperty.replace(/hidden/i, 'visibilitychange');
		var onVisibilityChange = function() {
				if (!document[hiddenProperty]) {
					this.isMin = false;
					console.log('页面非激活');
				} else {
					this.isMin = true;
					console.log('页面激活')
				}
			}.bind(this);
		document.addEventListener(visibilityChangeEvent, onVisibilityChange);

		//根据iP地址获取当前位置
		var mycity=new BMap.LocalCity();
		mycity.get(function(result){
		
		console.log("新位置："+result.name);
		sendRequest("updatecity", "post", "json", true, {account:this.account,new_city:result.name}, function(res){
			if(res.success){
				console.log("位置更新成功");
			}
		});
		}.bind(this));
		
		
		
		
		
		if (Notification == undefined) {
			this.suprot_notification = false;
		}
		if (Notification.permission == "default" || Notification.permission == "denied") {
			// 默认开启提醒功能
			Notification.permission = "granted";
		}

		

		// console.log(websocket);
		if (typeof(websocket) == "undefined") {
			// socket断开,重新连接
			console.log("重新建立socket连接");

			this.openSocket(this.account);

		}
		// 初始化用户信息

		sendRequest("getUserInfo", "post", "json", true, {
			"account": this.account
		}, function(data) {
			if (data.success == "false") {
				console.log("用户信息初始化失败!");
				return;
			}
			console.log(data);
			this.username = data.data.username;
			this.new_username=this.username;

			this.icon_src = "get_icon?account=" + this.account + "&code=" + 100 * Math.random();
		}.bind(this));

		console.log("app_panel_page:");
		console.log(this);
		// 默认显示最近联系人,同时加载全部好友
		this.$refs.friend_list_recent.comp_ident = "recent";
		this.$refs.friend_list_all.comp_ident = "contact";
		this.$refs.friend_list_all.init("contact", {
			"account": this.account
		});
		this.$refs.friend_list_recent.init("recent", {
			"account": this.account
		});
		this.tabItemClick("recent");
	},
	template: loadHTML("components/app_panel_page/app_panel_page.html"),
	events: {

	},
	methods: {
		change_username:function(){
			this.username_hidden=true;
			this.username_input_hidden=false;
		},
		submit_username:function(){
			if(this.username==this.new_username || this.new_username==""){
				this.username_hidden=false;
				this.username_input_hidden=true;
				return;
			}
			
			sendRequest("changeUserName", "post", "json", false, {account:this.account,new_uname:this.new_username}, function(res){
				if(res.success){
					this.username=res.data;
					this.username_hidden=false;
					this.username_input_hidden=true;
				}
			}.bind(this));
		},
		set_right_panel: function(data) {
			// console.log("set_right_panel----app:"+data);
			if (data.show_page != "chat_panel_comp") {
				this.chat_panel_type = null;
				this.chat_panel_role = null;
			}
			this.rightCurrContent = data.show_page;

			this.$nextTick(function() {
				// 延迟回调，等待动态组件加载完毕传递初始化数据
				this.$refs.right_panel.init(data.opts);
				// this.$refs.right_panel.account=this.account;
			});

		},

		tabItemClick: function(val) {
			console.log("------切换标签页------" + val);
			if (val == "recent") {
				// 显示最近联系人
				this.recent_icon = "images/chat_yes_icon.png"; // 显示按下图标
				this.wenzhang_icon = "images/wenzhang_no_icon.png";
				this.contact_icon = "images/contact_no_icon.png";
				this.tabShowRecent = true; // 显示最近联系人选项卡
				this.tabHideRecent = false;
				this.tabShowWenzhang = false;
				this.tabhideWenzhang = true;
				this.tabShowContact = false;
				this.tabHideContact = true;
				// this.$refs.friend_list_recent.comp_ident="recent";
				// this.$refs.friend_list_recent.init(val,{"account":this.account});
			}
			if (val == "wenzhang") {
				// 显示最近联系人
				this.recent_icon = "images/chat_no_icon.png"; // 显示按下图标
				this.wenzhang_icon = "images/wenzhang_yes_icon.png";
				this.contact_icon = "images/contact_no_icon.png";
				this.tabShowRecent = false; // 显示最近联系人选项卡
				this.tabHideRecent = true;
				this.tabShowWenzhang = true;
				this.tabhideWenzhang = false;
				this.tabShowContact = false;
				this.tabHideContact = true;
			}
			if (val == "contact") {
				// 显示全部好友
				this.recent_icon = "images/chat_no_icon.png"; // 显示按下图标
				this.wenzhang_icon = "images/wenzhang_no_icon.png";
				this.contact_icon = "images/contact_yes_icon.png";
				this.tabShowRecent = false; // 显示最近联系人选项卡
				this.tabHideRecent = true;
				this.tabShowWenzhang = false;
				this.tabhideWenzhang = true;
				this.tabShowContact = true;
				this.tabHideContact = false;
				// this.$refs.friend_list_all.comp_ident="contact";
				// this.$refs.friend_list_all.init(val,{"account":this.account});
			}
		},
		changeIcon: function() {
			console.log("修改头像");
			var param = {
				action: "headicon",
				opts: {
					account: this.account
				}
			};
			this.$refs.upload_file.init(param);
		},
		showAddFriPanel: function() {
			console.log("显示添加好友面板");
			this.rightCurrContent = "addFriPanel";
		},
		openSocket: function(account) {
			// 打开websocket通道
			websocket_open(
			account, function(event) {
				console.log("打开websocket通道");
			}, function(event) {
				// 接收消息回调函数，将消息分发给子组件
				console.log("接收到消息：" + event.data);
				var respDate = JSON.parse(event.data);
				console.log(respDate);
				if (respDate.datetype == "json") {
					if (respDate.resptype == "system") {
						// 系统消息响应,将消息内容分发给组件
						console.log("------system----");
						console.log(JSON.parse(event.data));
						this.$refs.friend_list_recent.$refs.system_msg_title_comp.init(respDate.msgcontent);

					}
					if (respDate.resptype == "frilist_add") {
						console.log("------frilist_add----");
						console.log(JSON.parse(event.data));
						this.$refs.friend_list_all.add_data(JSON.parse(respDate.msgcontent));
					}
					if (respDate.resptype == "frilist_recent") {
						console.log("------frilist_recent----");
						console.log(JSON.parse(event.data));
						this.$refs.friend_list_recent.init_data(respDate.msgcontent);
					}
					if (respDate.resptype == "singlechat") {
						this.single_msg_service(
						respDate, "text");
					}

					if (respDate.resptype == "groupchat") {
						console.log("接收到群聊消息");
						this.group_msg_service(
						respDate, "text");
					}
				}
				if (respDate.datetype == "img") {
					console.log("接收到图片消息");

					if (respDate.resptype == "singlechat") {
						console.log("单聊图片消息");
						var msg_content = JSON.parse(respDate.msgcontent);
						msg_content.msg = {
							new_img_src: "get_chat_file?type=pic&filename=" + msg_content.new_src,
							ori_img_src: "get_chat_file?type=pic&filename=" + msg_content.ori_src,
						}

						respDate.msgcontent = msg_content;
						this.single_msg_service(
						respDate, "img");
					}
					if (respDate.resptype == "groupchat") {
						console.log("群聊图片消息");
						var msg_content = JSON.parse(respDate.msgcontent);
						msg_content.msg = {
							new_img_src: "get_chat_file?type=pic&filename=" + 	msg_content.new_src,
							ori_img_src: "get_chat_file?type=pic&filename=" + msg_content.ori_src,
						}
						respDate.msgcontent = msg_content.msg;
						this.group_msg_service(
						respDate, "img");
					}
				}
				if (respDate.datetype == "file") {
					if (respDate.resptype == "singlechat") {
						console.log("单聊文件消息");
						var msg_content = JSON.parse(respDate.msgcontent);

						msg_content.msg = {
							src: "get_chat_file?type=file&filename=" + msg_content.ori_src,
							filename: msg_content.new_src,
						}


						respDate.msgcontent = msg_content;
						this.single_msg_service(
						respDate, "file");
					}
					if (respDate.resptype == "groupchat") {
						console.log("群聊文件消息");
						var msg_content = JSON.parse(respDate.msgcontent);
						msg_content.msg = {
							src: "get_chat_file?type=file&filename=" + msg_content.ori_src,
							filename: msg_content.new_src,
						}


						respDate.msgcontent = msg_content.msg;
						this.group_msg_service(
						respDate, "file");
					}
				}

			}.bind(this), function(e) {
				// 链接断开
				console.log("ws:与服务器的链接已断开");

			});

		},
		big_img_comp: function(data) {
			console.log("big");

			this.$refs.show_big_img.init(data);

		},
		open_chat_panel: function(opts) {
			/**
			 * 数据结构opts{ chat_tip:用户账号或者群id type:聊天类型 account,
			 * type, fri_accounts:{ headicon_src,
			 *  } fri_accounts[0].headicon_src,
			 *  }
			 */
			console.log("打开聊天面板:" + opts.chat_tip);
			this.chat_panel_role = opts.chat_tip;
			this.chat_panel_type = opts.type;
			// 根据用户账号或群聊id获得相关参数\

			if (this.$refs.friend_list_recent.is_exit(opts.chat_tip)) {
				// 当前聊天列表存在该用户
				if (this.tabShowRecent) {
					this.$refs.friend_list_recent.item_select_by_account(opts.chat_tip);
					return;
				}
				this.tabItemClick("recent");

			} else {
				// 当前聊天列表中不存在该用户,插入数据并通知子组件更新数据
				console.log("当前聊天列表中不存在:" + opts.chat_tip);
				sendRequest("add_recent", "post", "json", false, {
					"account": this.account,
					"chat_tip": opts.chat_tip,
					"type": opts.type
				}, function(data) {
					if (data.success) {
						// 插入成功，将该条数据显示在最近联系人中
						var type = "[群组]";
						var account = opts.chat_tip;
						if (opts.type == "single") {
							type = "";
							account = opts.fri_accounts[0].fri_account;
						}
						this.$refs.friend_list_recent.add_data({
							username: opts.username,
							account: account,
							type: type,
							fri_icon: opts.fri_accounts[0].headicon_src,
							time: null,
							num: 0
						});
						this.$refs.friend_list_recent.auto_select(opts.chat_tip);
						this.tabItemClick("recent");
					}
				}.bind(this));

			}
			if (opts.type = "single") {

			}

		},
		update_icon: function(data) {
			this.icon_src = null;
			this.icon_src = "get_icon?account=" + data + "&code=" + 100 * Math.random();
		},
		get_msg_box: function(account) {
			console.log(this.$refs.friend_list_recent.get_msg(account));
			this.msg_box_list = this.$refs.friend_list_recent.get_msg(account);
			// return
			// this.$refs.friend_list_recent.get_msg(account);
		},
		show_nitification: function(opts) {
			console.log(this.isMin);
			if (this.is_notificarion && this.isMin) {
				var notification = new Notification("消息提醒：", {
					"body": opts.body,
					"icon": opts.icon
				});
			}
		},
		close_call: function(type) {
			if (type == "o_voice") {
				this.isVoice = true;
			}
			if (type == "c_voice") {
				this.isVoice = false;
			}
			if (type == "o_noti") {
				this.is_notificarion = true;
			}
			if (type == "c_noti") {
				this.is_notificarion = false;
			}
		},
		get_contact: function() {
			// 获得全部好友
			this.contacts = this.$refs.friend_list_all.get_all_contacts();
		},
		get_recents: function() {
			this.recents = this.$refs.friend_list_recent.get_recents();
		},
		init_select_panel: function(data) {
			this.$refs.select_remebers.init(data);
		},
		update_remebers: function(group_id) {
			this.$refs.right_panel.update_remebers(group_id);
		},
		delete_recent:function(friaccount){
			this.$refs.friend_list_recent.delete_recent(friaccount);
		},
		open_select_panel: function(action) {
			var contacts = this.$refs.friend_list_all.get_all_contacts();
			var recents = this.$refs.friend_list_recent.get_recents();

			var role = null;
			var exists = null;
			var exists_type = null;

			if (this.chat_panel_type == "single") {
				role = this.chat_panel_role;

				exists_type = "single";
				exists = this.$refs.right_panel.get_chat_obj();

			}
			if (this.chat_panel_type == "group") {
				exists_type = "group";
				role = this.chat_panel_role;
				exists = this.$refs.right_panel.get_chat_obj();
			}

			var data = {
				action: action,
				exists_type: exists_type,
				exists: exists,
				role: role,
				opts: {
					contacts: contacts,
					recents: recents,
				}
			};
			this.$refs.select_remebers.init(data);
		},
		upload_file: function(data) {
			this.$refs.upload_file.init(data);
		},
		group_msg_service: function(respDate, type) {
			var group_msg = {
				msg_type: "group",
				group_id: respDate.receiver,
				opts: {
					account: respDate.sender,
					msg: respDate.msgcontent,
					time: respDate.date,
					type: type
				}
			};
			if (this.chat_panel_role == respDate.receiver) {
				// 正在与当前对象聊天
				console.log("app_panel--->正在于当前对象聊天");
				this.$refs.friend_list_recent.add_msg(group_msg);

				// this.$refs.right_panel.change_msg_data();
				this.$refs.friend_list_recent.set_time(
				respDate.receiver, respDate.date.substring(11, 16));
				this.get_msg_box(respDate.receiver);

			} else {
				// 判断当前聊天列表中是否存在该群组，不存在则创建
				if (!this.$refs.friend_list_recent.id_exit_noselect(respDate.receiver)) {
					// 不存在
					sendRequest("add_recent", "post", "json", true, {
						"account": this.account,
						"chat_tip": respDate.receiver,
						"type": "group"
					}, function(res) {
						if (res.success) {
							// 插入成功，将该条数据显示在最近联系人中
							console.log(res);
							this.$refs.friend_list_recent.add_data({
								username: res.data.name,
								account: res.data.id,
								type: "[群组]"
							});
							this.$refs.friend_list_recent.add_msg(group_msg);
							this.$refs.friend_list_recent.set_num(respDate.receiver);
							this.$refs.friend_list_recent.set_time(
							respDate.receiver, respDate.date.substring(
							11, 16));

						}
					}.bind(this));
				} else {
					// 当前联系人存在于最近进联系人中，更新数据
					console.log("app_panel---->存在联系人，没有和它聊天");
					this.$refs.friend_list_recent.add_msg(group_msg);
					this.$refs.friend_list_recent.set_num(respDate.receiver);
					this.$refs.friend_list_recent.set_time(
					respDate.receiver, respDate.date.substring(11, 16));

				}
			}

		},
		single_msg_service: function(respDate, msg_type) {
			console.log("app_panel------>接收到单聊消息");
			console.log(respDate);
			var msg_content = null;
			if (respDate.datetype == "img" || respDate.datetype == "file") {
				msg_content = respDate.msgcontent;
			} else {
				msg_content = JSON.parse(respDate.msgcontent);
			}

			var single_msg = {
				type: "single",
				fri_account: respDate.sender,
				opts: {
					account: respDate.sender,
					msg: msg_content.msg,
					time: respDate.date,
					type: msg_type,
					// text，img

				}
			};
			var msg_time = single_msg.opts.time.substring(11, 16);
			if (respDate.sender == this.account) {
				// 自己的
				console.log("app_panel------>接收到自己的消息");
				single_msg.fri_account = respDate.receiver;
				this.$refs.friend_list_recent.add_msg(single_msg);
				this.$refs.friend_list_recent.set_time(
				respDate.receiver, msg_time);
				this.get_msg_box(respDate.receiver);

			} else {

				if (this.isMin) {
					$("#call_voice")[0].play();
					this.show_nitification({
						body: single_msg.opts.msg,
						icon: "get_icon?account=" + single_msg.opts.account + "&code=" + 100 * Math.random()
					});
				}

				if (this.$refs.friend_list_recent.id_exit_noselect(respDate.sender)) {
					// 在最近联系人中
					if (this.chat_panel_role == respDate.sender) {
						console.log("app_panel------>当前正在与单聊联系人聊天");
						sendRequest("changeSingleMsgState", "post", "json", true, {
							"msg_id": msg_content.msg_id
						}, function(res) {
							if (res.success) {
								console.log("修改成功");
							}
							this.$refs.friend_list_recent.add_msg(single_msg);
							this.get_msg_box(respDate.sender);
						}.bind(this));
					} else {
						
						console.log("app_panel------>未与当前联系人聊天");
						this.$refs.friend_list_recent.add_msg(single_msg);
						this.$refs.friend_list_recent.set_time(
						respDate.sender, msg_time);
						this.$refs.friend_list_recent.set_num(respDate.sender);
						if(this.isVoice){
							$("#call_voice")[0].play();
						}
					}

				} else {
					// 不再最近联系人中
					sendRequest("add_recent", "post", "json", true, {
						"account": this.account,
						"chat_tip": respDate.sender,
						"type": "single"
					}, function(res) {
						if (res.success) {
							// 插入成功，将该条数据显示在最近联系人中
							console.log(res);
							this.$refs.friend_list_recent.add_data({
								username: res.data.username,
								account: res.data.account,
								type: "single",
								fri_icon: "get_icon?account=" + res.data.account + "&code=" + 100 * Math.random()
							});

							this.$refs.friend_list_recent.add_msg(single_msg);
							this.$refs.friend_list_recent.set_time(
							respDate.sender, msg_time);
							this.$refs.friend_list_recent.set_num();
							if (this.isVoice) {
								$("#call_voice")[0].play();
							}

						}
					}.bind(this));
				}
			}
		}
	}
});